/**
* @file index.vue.vue
* @author huang
* @date 2023/8/17
* @description 全部工单
* @projectName
* @email newflyhuang@gmail.com
*/

<template>
  <pure-table
    :list-api="listApi"
    :query-condition="queryCondition"
  >
    <template #header>
      <query-panel
        @query="onQuery"
        @reset="onReset"
      >
        <el-form-item>
          <el-input
            v-model="queryForm.keywords"
            placeholder="故障描述/工单号/报修电话"
          />
        </el-form-item>
        <el-form-item>
          <el-date-picker
            v-model="queryForm.createTime"
            end-placeholder="建单结束时间"
            start-placeholder="建单开始时间"
            type="daterange"
            value-format="yyyy-MM-dd"
          />
        </el-form-item>
        <el-form-item>
          <el-date-picker
            v-model="queryForm.repairTime"
            end-placeholder="报修结束时间"
            start-placeholder="报修开始时间"
            type="daterange"
            value-format="yyyy-MM-dd"
          />
        </el-form-item>
        <el-form-item>
          <el-input
            v-model="queryForm.createUserId"
            placeholder="建单人"
          />
        </el-form-item>
        <el-form-item>
          <el-input
            v-model="queryForm.departmentId"
            placeholder="报修院区"
          />
        </el-form-item>
        <el-form-item>
          <el-input
            v-model="queryForm.rangeType"
            placeholder="影响范围"
          />

        </el-form-item>

        <el-form-item>
          <el-input
            v-model="queryForm.source"
            placeholder="报障来源"
          />
        </el-form-item>
        <el-form-item>
          <el-input
            v-model="queryForm.receptionUserId"
            placeholder="坐席人"
          />
        </el-form-item>
        <el-form-item>
          <el-input
            v-model="queryForm.makeUserId"
            placeholder="处理人"
          />
        </el-form-item>
      </query-panel>
    </template>
    <el-table-column
      label="故障描述"
      prop="faultRemark"
    />

    <el-table-column
      label="工单号"
      prop="orderNum"
    />
    <el-table-column
      label="状态"
      prop="currState"
    />
    <el-table-column
      label="报修院区/科室"
      prop="deptName"
    />

    <el-table-column
      label="故障分类"
      prop="faultType"
    />

    <el-table-column
      label="影响范围"
      prop="rangeType"
    />

    <el-table-column
      label="报修电话"
      prop="phone"
    />
    <el-table-column
      label="报修时间"
      prop="repairTime"
    />

    <el-table-column
      label="建单人"
      prop="createUser"
    />
    <el-table-column
      label="建单时间"
      prop="createTime"
    />

    <el-table-column
      label="报障来源"
      prop="source"
    />

    <el-table-column
      label="坐席人"
      prop="receptionUser"
    />

    <el-table-column
      label="处理人"
      prop="makeUser"
    >
      <template #default="{row}">
        {{ row.makeUser || '-' }}
      </template>
    </el-table-column>

  </pure-table>
</template>

<script>
import QueryPanel from '@/common/components/query/queryPanel.vue';
import AllWorkOrderApi from './api';
import { debounce, } from 'lodash-es';

export default {
  components: { QueryPanel, },
  data() {
    return {
      listApi: AllWorkOrderApi.queryAllWorkOrder,
      queryCondition: {},
      queryForm: {
        // 建单结束时间(yyyy-MM-dd)
        createEndTime: '',
        // 建单开始时间(yyyy-MM-dd)
        createStartTime: '',
        createTime: [],
        // 建单人id
        createUserId: '',
        // 科室ID
        departmentId: '',
        // 关键字
        keywords: '',
        // 处理人ID
        makeUserId: '',
        // 影响范围
        rangeType: '',
        // 坐席人ID
        receptionUserId: '',
        // 报修结束时间(yyyy-MM-dd)
        repairEndTime: '',
        // 报修开始时间(yyyy-MM-dd)
        repairStartTime: '',
        repairTime: [],
        // 工单来源
        source: '',
      },
    };
  },
  methods: {
    // 查询
    onQuery: debounce(function () {
      this.queryCondition = {
        ...this.queryForm,
      };
      this.queryCondition.createStartTime = this.queryForm.createTime[0];
      this.queryCondition.createEndTime = this.queryForm.createTime[1];
      this.queryCondition.repairStartTime = this.queryForm.repairTime[0];
      this.queryCondition.repairEndTime = this.queryForm.repairTime[1];
    }, 300),
    // 重置
    onReset: debounce(function () {
      this.queryForm = {
        // 建单结束时间(yyyy-MM-dd)
        createEndTime: '',
        // 建单开始时间(yyyy-MM-dd)
        createStartTime: '',
        createTime: [],
        // 建单人id
        createUserId: '',
        // 科室ID
        departmentId: '',
        // 关键字
        keywords: '',
        // 处理人ID
        makeUserId: '',
        // 影响范围
        rangeType: '',
        // 坐席人ID
        receptionUserId: '',
        // 报修结束时间(yyyy-MM-dd)
        repairEndTime: '',
        // 报修开始时间(yyyy-MM-dd)
        repairStartTime: '',
        repairTime: [],
        // 工单来源
        source: '',
      };
      this.queryCondition = {};
    }, 300),
  },

};
</script>

<style lang='scss'
  scoped
>

</style>
